<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript">
        // 从末尾添加 不直接修改原来的数组
        function addEl(arr,item){
            let temp = arr.slice();
            temp.push(item);
            return temp;
        }
        console.log(addEl([1,2,3],4));

        function add1(arr,item){
            return arr.concat(item);
        }
        console.log(add1([1,2,3],4));

        function add2(arr,item){
            return [...arr,item];
        }
        console.log(add2([1,2,3],4));
        // 从前添加，不直接修改原来的数组
        function beforeAdd(arr,item){
            let temp = arr.slice();
            temp.unshift(item);
            return temp;
        }
        console.log(beforeAdd([1,2,3,4],5));

        function beforeAdd1(arr,item){
             return [item,...arr];
        }
        console.log(beforeAdd1([1,2,3,4],5));

        function beforeAdd2(arr,item){
            return [item].concat(...arr);
        }
        console.log(beforeAdd2([1,2,3,4],5));
    </script>
</body>
</html>